<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <base href="${request.contextPath}/"/>
    <meta charset="UTF-8">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,minimum-scale=1.0">
    <title>大事小事</title>
    <link href="Content/wechat/css/reset.css" rel="stylesheet" type="text/css">
    <!--赞-->
    <link href="Content/wechat/css/demo.css" rel="stylesheet" type="text/css">
    <!--end 赞-->
    <link href="Content/wechat/css/tongCheng_xx.css" rel="stylesheet" type="text/css">

    <script src="Content/wechat/js/jquery.min.js"></script>
    <!--字体缩放-->
    <script src="Content/wechat/js/ziti.js"></script>
    <!--end 字体缩放-->
    <!--页码-->
    <link href="Content/wechat/css/myPagination.css" rel="stylesheet" type="text/css">
    <script src="Content/wechat/js/myPagination.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <script>
        wx.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
            appId: '${jsApiConfig.appId!}', // 必填，公众号的唯一标识
            timestamp: ${jsApiConfig.timestamp!}, // 必填，生成签名的时间戳
            nonceStr: '${jsApiConfig.nonceStr!}', // 必填，生成签名的随机串
            signature: '${jsApiConfig.signature!}',// 必填，签名
            jsApiList: ['chooseImage', 'uploadImage', 'updateAppMessageShareData', 'onMenuShareAppMessage','updateTimelineShareData'] // 必填，需要使用的JS接口列表
        });
    </script>

</head>
<body>
<div class="header">
    <input type="hidden" id="commentid" name="commentid" value="${comment.rows[0].id!}"/>
    <div class="name_up clearfix">
        <img class="img_02" src="${comment.rows[0].headimgurl!}">
        <p>${comment.rows[0].nickname!}</p>
        <!--        <span class="v"></span>-->
        <u>${comment.rows[0].date!}</u>
    </div>
    <!--end 头像信息-->
    <div class="header_xx">
        <h4>${comment.rows[0].title!}</h4>
        <p>${comment.rows[0].content!}</p>
        <div id="imgs">


        </div>
    </div>

    <!--    赞-->
    <div class="praise">
         <span id="praise"><img src="" id="praise-img"/></span>
        <span id="praise-txt">${comment.rows[0].goodnum!}</span>
        <span id="add-num"><em>+1</em></span>
    </div>

    <!--动态点赞结束-->

</div>
<!--评论-->
<div class="header">
    <div class="pingLun">
        <div class="pingLun_title">
            <h4>全部评论<i id="allPostsNum">()</i></h4>
        </div>
        <div id="liuYan_box">
<!--            <div class="pingLun_box">-->
<!--                <div class="name_up_pl clearfix" style="margin-bottom: 0">-->
<!--                    <img class="img_02" src="Content/wechat/images/header.jpg">-->
<!--                    <p>Hello</p>-->
<!--                    <span class="v"></span>-->
<!--                    <u>2019-12-02</u>-->
<!--                </div>-->
<!--                <div class="neiRong_pl">-->
<!--                    <p>请问去过的要怎么样玩比较省心省钱少走弯路</p>-->
<!--                </div>-->
<!--            </div>-->
        </div>
    </div>
    <div id="pagination" class="pagination"></div>
    <button onclick=window.location="/wechat/forum/posts_add?id=${comment.rows[0].id!}" class="btn_pl">发布评论</button>
</div>


</body>
<script>

    window.onload = function () {
        //点赞
        var zan = '${comment.rows[0].zan!}';
        if (zan == '0') {
            $("#praise-img").attr("src", "Content/wechat/images/zan.png");
        } else {
            $("#praise-img").attr("src", "Content/wechat/images/yizan.png");
        }

        var imgs = '${comment.rows[0].imgUrl!}';
        var img_arr = imgs.split(",");
        var img_html = "";
        for (var i = 0; i < img_arr.length; i++) {
            if (img_arr[i] != null && img_arr[i] != "") {
                img_html += "<img src='" + img_arr[i] + "'/>";
            }
        }
        $("#imgs").html(img_html);
        InitAjax(1);
    }

    /* @author:Romey
     * 动态点赞
     * 此效果包含css3，部分浏览器不兼容（如：IE10以下的版本）
     */
    $(function () {
        //点赞
        $("#praise").click(function () {
            var praise_img = $("#praise-img");
            var text_box = $("#add-num");
            var praise_txt = $("#praise-txt");
            var num = parseInt(praise_txt.text());
            if (praise_img.attr("src") == ("Content/wechat/images/yizan.png")) {
                zan(-1);
                $(this).html("<img src='Content/wechat/images/zan.png' id='praise-img' class='animation' />");
                praise_txt.removeClass("hover");
                text_box.show().html("<em class='add-animation'>-1</em>");
                $(".add-animation").removeClass("hover");
                num -= 1;
                praise_txt.text(num)
            } else {
                zan(1);
                $(this).html("<img src='Content/wechat/images/yizan.png' id='praise-img' class='animation' />");
                praise_txt.addClass("hover");
                text_box.show().html("<em class='add-animation'>+1</em>");
                $(".add-animation").addClass("hover");
                num += 1;
                praise_txt.text(num)
            }
        });


    })

    //点赞
    function zan(yizan) {
        $.ajax({
            //几个参数需要注意一下
            type: "POST",//方法类型
            dataType: "json",//预期服务器返回的数据类型
            url: "/wechat/forum/zan",//url
            data: {
                zan: yizan,
                id: $("#commentid").val()
            },
            success: function (result) {
                console.log(result);//打印服务端返回的数据(调试用)
            }
            ,
            error: function () {
                alert("异常！");
            }
        });
    }


    //分页
    var pageTotal = 0;   //总页数
    var pageSize = 3;    //一页显示几个

    function onLoadPaging() {
        new myPagination({
            id: 'pagination',
            curPage: 1, //初始页码
            pageTotal: pageTotal, //总页数
            pageAmount: pageSize,  //每页多少条
            pageSize: 2, //可选,分页个数

            getPage: function (page) {
                //获取当前页数
                InitAjax(page)
            }
        })
    }

    function InitAjax(pageNum) {
        $.ajax({
            url: "/wechat/forum/posts_list",
            type: 'post',
            dataType: 'json',
            data: {
                pagination: "{page:\"" + pageNum + "\",rows:\"" + pageSize + "\",sidx:\"\",sord:\"\"}",
                id: $("#commentid").val()
            }, success: function (result) {
                ajaxCallBack(result);
            }

        })
    }

    function ajaxCallBack(data) {
        var insetViewData = ""; //视图数据
        $("#allPostsNum").html("("+data.data.records+")");
        $.each(data.data.rows, function (index, items) {
            insetViewData += " <div class=\"pingLun_box\">\n" +
                "                <div class=\"name_up_pl clearfix\" style=\"margin-bottom: 0\">\n" +
                "                    <img class=\"img_02\" src=\""+items.headimgurl+"\">\n" +
                "                    <p>"+items.nickname+"</p>\n" +
                // "                    <span class=\"v\"></span>\n" +
                "                    <u>"+items.date+"</u>\n" +
                "                </div>\n" +
                "                <div class=\"neiRong_pl\">\n" +
                "                    <p>"+items.postscontent+"</p>\n" +
                "                </div>\n" +
                "            </div>";

        });
        $("#liuYan_box").html(insetViewData);
        if (pageTotal == 0) {
            pageTotal = data.data.total;
            onLoadPaging()
        }
    }

</script>
<script>
    var imgUrl = "${wxPortURl!}/Content/wechat/mhlogo.png";
    var link = "${wxPortURl!}/wechat/login?state=FornumInfo_${comment.rows[0].id!}";
    var title = "${comment.rows[0].title!}";
    var desc ="${comment.rows[0].content!}";
    wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
        wx.updateAppMessageShareData({
            title: title, // 分享标题
            desc: desc, // 分享描述
            link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            imgUrl: imgUrl, // 分享图标
            success: function () {

            }
        })

        wx.updateTimelineShareData({
            title: title, // 分享标题
            link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            imgUrl: imgUrl, // 分享图标
            success: function () {

            }
        })
    });
    function getSimpleText(html) {
        var re1 = new RegExp("<.+?>", "g");//匹配html标签的正则表达式，"g"是搜索匹配多个符合的内容
        var msg = html.replace(re1, '');//执行替换成空字符
        return msg;
    }
</script>

</html>